<template>
	<view class="app">
		<view class="address-list">
			<u-radio-group class="address-item" v-for="(item,index) in list" @change="changeDefaultAddress" :key="item.address_id" v-model="defaultAddress">
				<u-card @head-click="chooseAddress(item)" @body-click="chooseAddress(item)" :title="item.address_contacts" :sub-title="item.address_mobile" title-size="36" sub-title-size="30">
					<view  slot="body">
						<view class="address-info">
							{{item.address_name}}<br>
							{{item.address_door}}
						</view>
					</view>
					<view class="address-btn-row" slot="foot">
						<view class="address-btn-left">
							<u-radio :name="item.address_id">默认地址</u-radio>
						</view>
						<view class="address-btn-right">
							<u-button  plain size="mini" type="primary" @click="gotoPage('/pageA/address/info?address_id='+item.address_id)"><u-icon name="edit-pen"></u-icon>编辑</u-button>
							<u-button  plain size="mini" type="error" @click="deleteAddress(item.address_id)"><u-icon name="trash"></u-icon>删除</u-button>
						</view>
					</view>
				</u-card>
			</u-radio-group>
		</view>
		<view class="address-bottom-row">
			<u-button shape="square" type="success" @click="gotoPage('/pageA/address/info')">添加地址</u-button>
		</view> 
		<c-safe-bottom></c-safe-bottom>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				defaultAddress:"",
				list:[],
				isChoose:0,
				isShe:'',
				order_id:'',
				tabIndex:''
			}
		},
		onLoad(option){
			if(option?.choose){
				this.isChoose = option.choose
			} 
			if(option?.she){
				this.isShe = option.she
			}
			if(option?.tabIndex){
				this.tabIndex = option.tabIndex
			}
			if(option?.order_id){
				this.order_id = option.order_id
			}
			if(option?.page){
				this.page = option.page
			}
		}, 
		onShow() {
			this.getAddressList()
		},
		methods:{
			gotoPage(url){
				uni.navigateTo({
					url
				});
			},
			getAddressList(){ 
				this.$u.api.address.getAddressList().then(res => {
					console.log(res, 11)
					this.list = res?.data || []
					if(this.list.length > 0){
						let defaultAdd =  this.list.find(item => item.address_default == 1)
						this.defaultAddress =  defaultAdd?.address_id || "0"
					}
				})
			},
			deleteAddress(address_id){
				let _this = this
				uni.showModal({
					title: '提示',
					content: '删除后无法恢复，是否删除？',
					success: function (res) {
						if (res.cancel) {
							return false
						}
						_this.$u.api.address.deleteAddress({ address_id: address_id }).then(res => {
							if(res.code != 1){ 
								_this.$u.toast(res.msg)
								return false
							} 
							if(_this.vuex_chooseAddress.address_id == address_id){
								_this.$u.vuex('vuex_chooseAddress',  {})
							}
							_this.getAddressList()
						}).catch(err => {
							console.log(err)
							_this.$u.toast('删除失败')
						})
					}
				});
			},
			changeDefaultAddress(e){
				let updateItem = this.list.find(item => item.address_id == e)
				updateItem.address_default = 1
				this.$u.api.address.saveAddress(updateItem).then(res => { 
					if(res.code != 1){ 
						this.$u.toast(res.msg)
						return false
					} 
				}).catch(err => {
					this.$u.toast('设置失败')
				})
			},
			chooseAddress(item){
				if(this.order_id != '' && this.isShe){
					let obj = {
						order_id:this.order_id,
						address_id:item.address_id
					}
					this.$u.api.shop.changeAddress(obj).then(res =>{
						console.log(res,'啥意思啊');
						if(res.code ==1){
							this.$u.vuex('vuex_chooseAddress',item || {})
							if(this.page == 1){
								uni.redirectTo({
									url:`../../pages/shop/AwaitShipments?order_id=${this.order_id}`
								})
							}else if(this.page == 0){
								uni.redirectTo({
									url:`../../pages/shop/AwaitPay?order_id=${this.order_id}`
								})
							}else if(this.page == 3){
								uni.redirectTo({
									url:`../../pages/shop/Canceled?order_id=${this.order_id}`
								})
							}else if(this.page == 2){
								uni.redirectTo({
									url:`../../pages/shop/Receiving?order_id=${this.order_id}`
								})
							}
							else if(this.page == 4){
								uni.redirectTo({
									url:`../../pages/shop/exchange`
								})
							}
						}
					})
				}
				if(this.isShe){
					this.$u.vuex('vuex_chooseAddress',item || {})
					uni.navigateBack()
				}
				if(this.isShe && this.tabIndex!=''){
					this.$u.vuex('vuex_chooseAddress',item || {})
					uni.navigateBack()
				}
				if(!this.isChoose){
					return false
				}
				this.$u.vuex('vuex_chooseAddress',item || {})
				uni.navigateBack()
			}
		}, 
		
	}
</script>
<style scoped>   
	// #ifdef H5
	uni-page-wrapper,uni-page-body{height: 100%;overflow: hidden;}
	.app{ height: 100%;overflow: hidden;display: flex;flex-direction: column;}
	// #endif
	// #ifndef H5
	.app{ height: calc(100vh);overflow: hidden;display: flex;flex-direction: column;}
	// #endif
	.address-list{ flex:1;overflow: scroll; }
	.address-bottom-row{ flex-shrink: 0;padding: 20rpx;}
	/deep/ .u-card__head--left__title{ font-weight: bold;}
	.address-info{ font-size: 30rpx;line-height: 46rpx;word-wrap: break-word;}
	.address-btn-row{ display: flex;align-items: center;}
	.address-btn-right{flex:1;text-align: right;}
	/deep/ .address-btn-right .u-btn{margin-left: 20rpx;padding:0 30rpx}
	/deep/ .u-card{margin:20rpx 20rpx 0 20rpx !important;}
	.address-item{ display: block;}
</style>
